<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<html>
<head>
    <title>客户操作列表</title>
    <link href="${pageContext.request.contextPath }/css/bootstrap.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath }/js/bootstrap.js"></script>
    <style>
        tr:nth-child(even) {
            background-color: #eeeeee;
        }
        #d1{
            text-decoration: none;
        }

        #d2{
            text-align: center;
        }
        #d3{
            width: 1500px;

            text-align: center;
        }
        .input-group{
            width:300px;
            float: left;
        }
        #p2{
            font-size: 40px;

        }
        #d4{
            margin-left: 110px;
            margin-top: 50px;
        }
        #d5{
            margin-left: 60px;
            margin-top: 50px;

        }
        #d6{
            margin-top: 50px;
            width: 150px;
            margin-left: 20px;
        }
        #but1{
            margin-top: 50px;
            margin-left: -80px;
            height: 33px;

        }
        #but2{
            margin-left: 50px;
            margin-top: 50px;
        }
        #but3{
            margin-top: 50px;
        }
        #d7{
            width: 1400px;
            margin-left: 80px;
            margin-top: 20px;
            height: 1000px;

        }
        #ta1{
            text-align: center;
        }
        #tr1{
            background-color: #D9EDF7;
        }
        #d9{
            margin-top: 50px;
            width: 200px;
            margin-left: 20px;
        }
    </style>
</head>
<body>
    当前帐户： 尊敬的<span style="color: #337ab7"> ${ adminUser.username } </span>您好，您可以
    <c:if test="${ adminUser.username eq 'admin' }">
        <a href="${ pageContext.request.contextPath }/user/list">返回用户列表</a> |
    </c:if>
    <a href="${ pageContext.request.contextPath }/user/deng.jsp">退出当前帐号</a>
<div id="d2">
    <p id="p2">欢迎来到客户管理系统</p>
    <div id="d3">
        <form action="${ pageContext.request.contextPath }/customer/listWithCondition" method="post" class="form-inline">
            <div class="input-group" id="d4">
                <span class="input-group-addon" id="sizing-addon2">客户姓名</span>
                <input type="text" class="form-control" placeholder="请输入客户姓名" aria-describedby="sizing-addon2" name="cname" value="${cname}">
            </div>
            <div class="input-group" id="d5">
                <span class="input-group-addon" id="sizing-addon3">客户年龄</span>
                <input type="number" class="form-control" placeholder="请输入最小年龄" aria-describedby="sizing-addon2" name="startAge" value="${startAge}">
            </div>
            <div class="input-group" id="d6">
                <input type="number" class="form-control" placeholder="请输入最大年龄" aria-describedby="sizing-addon2" name="endAge" value="${endAge}">
            </div>
            <div class="input-group" id="d9">
                    <span class="input-group-addon" id="sizing-addon7">客户级别</span>
                    <select class="form-control" name="clevel">
                        <option value="">-- 请选择 --</option>
                        <option value="1">青铜级别</option>
                        <option value="2">白银级别</option>
                        <option value="3">黄金级别</option>
                        <option value="4">钻石级别</option>
                    </select>
            </div>
            <div class="input-group" style="width:125px;margin-right: -100px">
                <button  type="submit" class="btn btn-warning" id="but1">
                    <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                </button>
            </div>
        </form>
        <div>
            <button type="button" class="btn btn-primary" id="but2" onclick="jumpAdd();">添加客户</button>
            <button type="button" class="btn btn-danger" id="but3" onclick="deleteWithMore();">删除客户</button>
        </div>
    </div>
    <div id="d7">
        <form method="post" id="listFormId">
            <table class="table table-bordered" id="ta1">
                <tr id="tr1">
                    <td><input type="checkbox" onchange="selectOption(this.checked)"></td>
                    <td><b>序号</b></td>
                    <td><b>客户姓名</b></td>
                    <td><b>客户性别</b></td>
                    <td><b>客户年龄</b></td>
                    <td><b>客户生日</b></td>
                    <td><b>客户余额</b></td>
                    <td><b>客户爱好</b></td>
                    <td><b>客户级别</b></td>
                    <td><b>操作</b></td>
                </tr>
                <c:forEach var="customer" items="${ customers }" varStatus="status">
                    <tr>
                        <td><input type="checkbox" name="ids" value="${customer.id}"></td>
                        <td>${status.count}</td>
                        <td>${customer.cname}</td>
                        <td>
                            <c:if test="${customer.gender eq 1}">男</c:if>
                            <c:if test="${customer.gender eq 2}">女</c:if>
                        </td>
                        <td>${customer.age}</td>
                        <td>${customer.birthday}</td>
                        <td>
                            <fmt:formatNumber value="${customer.balance}" pattern="￥,###.##"></fmt:formatNumber>
                        </td>
                        <td>
                            <c:if test="${ fn:contains(customer.love, 1) }">篮球</c:if>
                            <c:if test="${ fn:contains(customer.love, 2) }">足球</c:if>
                            <c:if test="${ fn:contains(customer.love, 3) }">排球</c:if>
                            <c:if test="${ fn:contains(customer.love, 4) }">棒球</c:if>
                        </td>
                        <td>
                            <c:if test="${ fn:contains(customer.clevel, 1) }">青铜级别</c:if>
                            <c:if test="${ fn:contains(customer.clevel, 2) }">白银级别</c:if>
                            <c:if test="${ fn:contains(customer.clevel, 3) }">黄金级别</c:if>
                            <c:if test="${ fn:contains(customer.clevel, 4) }">钻石级别</c:if>
                        </td>
                        <td>
                            <button type="button" class="btn btn-primary btn-sm" onclick="jumpUpdate('${customer.id}')">修改客户</button>
                            <button type="button" class="btn btn-danger btn-sm" onclick="deleteCustomer('${customer.id}','${customer.cname}')">删除客户</button>
                        </td>
                    </tr>
                </c:forEach>
            </table>
        </form>
        <div class="text-center">
            <ul class="pagination">
                <c:forEach var="pap" begin="${page.startPage}" step="1" end="${page.endPage}" varStatus="sta">
                    <c:if test="${sta.first}">
                        <li <c:if test="${page.currentPage eq 1}">class="disabled"</c:if> ><a href="${ pageContext.request.contextPath }/customer/list?currentPage=${page.currentPage - 1}">&laquo;</a></li>
                    </c:if>

                    <li <c:if test="${page.currentPage eq pap}">class="active"</c:if>><a href="${ pageContext.request.contextPath }/customer/list?currentPage=${pap}">${pap}</a></li>

                    <c:if test="${sta.last}">
                        <li  <c:if test="${page.currentPage eq page.endPage}">class="disabled"</c:if> ><a href="${ pageContext.request.contextPath }/customer/list?currentPage=${page.currentPage + 1}">&raquo;</a></li>
                    </c:if>
                </c:forEach>
                <div style="float: right; margin-left: 10px; margin-top: 7px;" class="text-primary">103条记录 共11页</div>
            </ul>
   
        </div>
    </div>
</div>
<script src="${pageContext.request.contextPath }/js/sys.js"></script>
<script>
    if(${ not empty msg }) {
        alert("${ msg }");
    }
    function deleteCustomer(cid,cname) {
        if (window.confirm("确认删除"+cname+"吗")){
            console.log("确认删除")
            window.location.href="${pageContext.request.contextPath }/customer/delete?id="+cid
        }
    }
    function jumpAdd() {
            window.location.href="${pageContext.request.contextPath }/customer/tian.jsp"
    }
    function jumpUpdate(cid) {
        if (window.confirm("确认修改"+cid+"吗")){
            window.location.href="${pageContext.request.contextPath }/customer/update?id="+cid
            window.event.returnValue=false;
        }

    }
    function deleteWithMore() {
        if (checkIsSelect("ids"))return;
        var formElem = document.getElementById("listFormId");
        formElem.action = "${ pageContext.request.contextPath }/customer/deleteWithMore";
        // 4.提交表单
        formElem.submit();

    }
    function selectOption(status) {
        var checkboxArr=document.getElementsByName("ids");
        for (var i = 0;i<checkboxArr.length;i++) {
            checkboxArr[i].checked = status;
        }
    }
</script>
</body>
</html>
